<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	  <script src="js/vue.js" type="text/javascript" charset="utf-8"></script>
	</head>
	<body>
		<div id="myApp">
			<span>用户：</span>
			<input type="text" v-model="user.name"/>
			<br>
			<span>性别：</span>
			<input type="radio" value="男" v-model="user.sex"/>男
			<input type="radio" value="女" v-model="user.sex"/>女
			<br>
			<span>民族：</span>
			<select v-model="user.eth">
			    <option value="0">----请选择民族-----</option>
				 <option value="汉族">汉族</option>
				 <option value="苗族">苗族</option>
				 <option value="彝族">彝族</option>
			</select>
			<br>
			<span>生日：</span>
			<input type="date" v-model="user.birthday" />
			<br>
			
			<span>爱好：</span>
			<input type="checkbox" value="看电影" v-model="user.hoby" />看电影
			<input type="checkbox" value="看书" v-model="user.hoby"/>看书
			<input type="checkbox" value="逛街" v-model="user.hoby"/>逛街
			<br>
			<span>提示：{{info}}</span>
		</div>
		
	</body>
	<script>
			new Vue({
				el:"#myApp",
				data:{
					info:"",
					user:{
						name:"",
						sex:"男",
						eth:"0",
						birthday:"2022-09-20",
						info:"",
						hoby:['看书','逛街']
						
					}
				}
			})
	</script>
</html>
